<template>
  <div class="packages">
    <div class="container">
      <div class="aside">
        <div ref="refsTable">
          <el-form style="margin-top: 10px;" label-width="60px" :inline="true" size="mini">
            <el-form-item label="登记时间">
              <el-date-picker v-model="value1" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期"
                value-format="yyyy-MM-dd HH:mm:ss" @change="timeChange1" style="width:311px"
                :default-time="['00:00:00', '23:59:59']" :picker-options="pickerOptions"></el-date-picker>
            </el-form-item>
            <el-form-item label="项目类型">
              <el-autocomplete class="inline-input" v-model="params.projectType" :fetch-suggestions="querySearch"
                placeholder="请选择" @select="handleSelectProject" @focus="change(0)" style="width:311px"
                clearable></el-autocomplete>
              <!-- <el-select v-model="params.projectType" placeholder="请选择" style="width:126px">
              <el-option value label="全部"></el-option>
              <el-option v-for="item in Arr.projectTypeArr" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select> -->
            </el-form-item>
            <el-form-item label="关键字">
              <el-input clearable v-model="params.unscrambleKey" placeholder="送检单位/送检姓名/分析样本编号/分析批次号"
                style="width:126px"></el-input>
            </el-form-item>
            <el-form-item label="状态" label-width='48px'>
              <el-select v-model="params.mainState" placeholder="请选择" style="width:126px">
                <el-option value label="全部"></el-option>
                <el-option v-for="(value, key) in mainStateObj" :key="key" :label="value" :value="key"></el-option>
              </el-select>

            </el-form-item>
            <el-form-item>
              <el-button size="mini" type="primary" @click="getList">查询</el-button>
            </el-form-item>
          </el-form>
        </div>
        <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
          @row-click="handleTableClick" border :header-cell-style="{ background: '#ebebeb' }" highlight-current-row
          :row-class-name="rowStyle" :height="heights" v-loading="loading" :cell-style="cellStyle">
          <!-- <el-table-column align="center" type="selection" width="55"></el-table-column> -->
          <el-table-column align="center" type="index" width="50" label="序号"></el-table-column>
          <el-table-column width="120" align="center" label="条码号" prop="barcodeCode"></el-table-column>
          <el-table-column width="100" align="center" prop="mainState" label="检测流程">
            <template slot-scope='{row}'>
              {{ mainStateObj[row.mainState] }}
            </template>
          </el-table-column>
          <el-table-column width="80" align="center" prop="submitName" label="姓名"></el-table-column>
          <el-table-column width="350" align="center" prop="projectTypeName" label="项目类型" show-overflow-tooltip>
          </el-table-column>
          <el-table-column width="200" align="center" prop="experimentNumber" label="实验编号"></el-table-column>
          <el-table-column width="100" align="center" prop="mainState" label="样本状态">
            <template slot-scope="{row}">
              {{ mainStateObj[row.mainState] }}
            </template>
          </el-table-column>
          <el-table-column width="250" align="center" prop="analyzeSampleNumber" label="分析样本编号"></el-table-column>
          <el-table-column width="150" align="center" prop="analyzeBatchNumber" label="分析批次号"></el-table-column>
        </el-table>

        <div style="height:60px"></div>
        <div class="block">
          <div>
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
              :page-sizes="[20, 50, 100, 200, 500]" layout="total, sizes, jumper" :total="listTotal" background>
            </el-pagination>
          </div>
          <el-dropdown trigger="click" placement="top" style="position:absolute;left:10px">
            <el-button size="mini" type="primary" style="width:32px;padding:0;height:25px;margin-top:3px">颜色</el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item style="background-color:#9dc3e6;color:black">背景蓝色：已初审</el-dropdown-item>
              <el-dropdown-item style="background-color:#a9d18e;color:black">背景绿色：已复审</el-dropdown-item>
              <el-dropdown-item style="background-color:#fcd967;color:black">背景黄色：已提交</el-dropdown-item>
              <el-dropdown-item style="background-color:#f4b183;color:black">背景红色：已上传</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
      <div class="main">
        <div @click="translate" class="translateBtn">
          <i class="el-icon-caret-left"></i>
        </div>
        <div class="btnBox">
          <el-form v-show="activeName == 'first' && btnShow == true" :inline="true">
            <el-form-item>
              <el-button style="height:25px;padding:0;width:60px" size="mini" type="primary" @click="getReportPreview"
                :disabled="Object.keys(row).length === 0">预览报告</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:40px" size="mini" type="warning" @click="returnBtn"
                :disabled="Object.keys(row).length === 0">回退</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:60px" size="mini" type="primary" @click="openManageLate"
                :disabled="Object.keys(row).length === 0">迟发申请</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:40px" size="mini" type="danger" @click="nullify"
                :disabled="Object.keys(row).length === 0">作废</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:40px" size="mini" type="primary" @click="getCompareTable"
                :disabled="Object.keys(row).length === 0">比对</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:40px" size="mini" type="primary" @click="getCompareImage"
                :disabled="Object.keys(row).length === 0">构图</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:60px" size="mini" type="primary" @click="getQualityReport"
                :disabled="Object.keys(row).length === 0">
                质控报告</el-button>
            </el-form-item>
            <el-form-item>
              <el-button style="height:25px;padding:0;width:75px" size="mini" type="primary"
                :disabled="Object.keys(row).length === 0">手动提交报告</el-button>
            </el-form-item>
          </el-form>
        </div>
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick2">         
          <el-tab-pane label="病原列表" name="first">
          <div style="background-color: #d5e4fb">
            <el-form :inline="true" style="background-color:#d5e4fb;padding:0 0 0 3px;margin:0" class="form_item">
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="primary" style="width:40px;padding:0;height:25px" @click="save"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 12 || row.mainState == 13 || row.mainState == 11)">保存</el-button>
              </el-form-item>
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="primary" style="width:40px;padding:0;height:25px" @click="confirmFirst"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 9 || row.mainState == 10 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)">初审中</el-button>
              </el-form-item>
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="primary" style="width:60px;padding:0;height:25px"
                  @click="confirmAlreadyFirst"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 9 || row.mainState == 10 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)">确认初审</el-button>
              </el-form-item>
              <!-- 删除初审 -->
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="danger" icon="el-icon-close" circle @click="deleteFirst"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 10 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)"
                  style="width:15px;height:15px;padding:0"></el-button>
              </el-form-item>
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="primary" style="width:40px;padding:0;height:25px;" @click="confirmReview"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 8 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)">复审</el-button>
              </el-form-item>
              <!-- 删除复审 -->
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="danger" icon="el-icon-close" circle @click="deleteReview"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 8 || row.mainState == 9 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)"
                  style="width:15px;height:15px;padding:0"></el-button>
              </el-form-item>
              <el-form-item style="margin-right:5px">
                <el-upload :action="uploadImgUrl" :on-success="handleUploadSuccess" :limit="1" :on-exceed="handleExceed"
                  name="file" :headers="upload.headers" :show-file-list="false"
                  :disabled="Object.keys(row).length === 0 || uploadDisabled">
                  <el-button size="mini" type="primary" style="width:60px;padding:0;height:25px" @click="addReport"
                    :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 8 || row.mainState == 9 || row.mainState == 12 || row.mainState == 13 || row.mainState == 11)">提交报告</el-button>
                </el-upload>
              </el-form-item>
              <el-form-item style="margin-right:5px">
                <el-button size="mini" type="primary" style="width:60px;padding:0;height:25px" @click="submitReport"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 8 || row.mainState == 9 || row.mainState == 10 || row.mainState == 13)">上传报告</el-button>
              </el-form-item>
              <el-form-item style="margin-right:0px">
                <span style="color:#606266;font-size:12px;">初审医生：{{ detail.firstDoctor }}</span>
                <span style="color:#606266;font-size:12px;margin-left:8px">复审医生：{{ row.reviewDoctor }}</span>
              </el-form-item>
              <el-form-item style="float:right;margin-right:5px">
                <el-button size="mini" type="primary" @click="ctrlBtnShow" style="width:60px;padding:0;height:25px"
                  :disabled="Object.keys(row).length === 0">更多功能
                </el-button>
              </el-form-item>
              <el-form-item style="float:right;margin-right:5px">
                <el-button size="mini" type="primary" @click="addRemarkDialog = true"
                  style="width:60px;padding:0;height:25px" :disabled="Object.keys(row).length === 0">添加备注</el-button>
              </el-form-item>
              <el-form-item style="float:right;margin-right:5px">

                <el-button size="mini" type="primary" style="width:60px;padding:0;height:25px;" class="relationBtn"
                  :disabled="Object.keys(row).length === 0" @click='relation'>关联病例
                  <el-button size="mini" type="danger" circle
                    style="width:15px;height:15px;padding:0;position:absolute;right:-5px;top:-5px">{{
                      relationTotal
                    }}</el-button>
                </el-button>
              </el-form-item>
              <el-form-item style="float:right;margin-right:5px">
                <el-button size="mini" type="warning" @click="cancelSubmitReasonDialog = true"
                  style="width:75px;padding:0;height:25px"
                  :disabled="Object.keys(row).length === 0 || (row.mainState == 7 || row.mainState == 8 || row.mainState == 9 || row.mainState == 10)">取消提交报告</el-button>
              </el-form-item>
            </el-form>
            <div class="container2">
              <el-tabs v-model="firstActiveName1" type="card" @tab-click="handleClick3">
                <el-tab-pane label="检出表" name="first-first">
                  <el-table ref="multipleTable1" :data="tableDataUp.tableDataUp1" tooltip-effect="dark"
                    style="width: 100%;" @selection-change="handleSelectionChangeUp1" border :row-class-name="rowStyle"
                    :header-cell-style="{
                      background: '#ebebeb'
                    }" height="190" v-loading="loading" :row-key="getRowKey">
                    <el-table-column align="center" width="50" label="操作" fixed v-if="columnShow">
                      <template slot-scope="{row}">
                        <span style="color:#0186ef;cursor:pointer" @click="deltableDataUp1(row)">删除</span>
                      </template>
                    </el-table-column>
                    <el-table-column align="center" type="selection" width="55" fixed
                      v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="微生态/疑似表" name="first-second">
                  <el-table ref="multipleTable2" :data="tableDataUp.tableDataUp2" tooltip-effect="dark"
                    style="width: 100%;" @selection-change="handleSelectionChangeUp2" border :row-class-name="rowStyle"
                    :header-cell-style="{
                      background: '#ebebeb'
                    }" height="190" v-loading="loading" :row-key="getRowKey">
                    <el-table-column align="center" width="50" label="操作" fixed v-if="columnShow">
                      <template slot-scope="{row}">
                        <span style="color:#0186ef;cursor:pointer" @click="deltableDataUp1(row)">删除</span>
                      </template>
                    </el-table-column>
                    <el-table-column align="center" type="selection" width="55" fixed
                      v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="耐药基因" name="first-third">
                  <el-table ref="multipleTable3" :data="tableDataUp.tableDataUp3" tooltip-effect="dark"
                    style="width: 100%;" @selection-change="handleSelectionChangeUp3" border :row-class-name="rowStyle"
                    :header-cell-style="{
                      background: '#ebebeb'
                    }" height="190" v-loading="loading" :row-key="getRowKey">
                    <el-table-column align="center" width="50" label="操作" fixed v-if="columnShow">
                      <template slot-scope="{row}">
                        <span style="color:#0186ef;cursor:pointer" @click="deltableDataUp3(row)">删除</span>
                      </template>
                    </el-table-column>
                    <el-table-column align="center" type="selection" width="55" fixed
                      v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown3.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>




                </el-tab-pane>
                <el-tab-pane label="毒力基因" name="first-fourth">
                  <el-table ref="multipleTable4" :data="tableDataUp.tableDataUp4" tooltip-effect="dark"
                    style="width: 100%;" @selection-change="handleSelectionChangeUp4" border :row-class-name="rowStyle"
                    :header-cell-style="{
                      background: '#ebebeb'
                    }" height="190" v-loading="loading" :row-key="getRowKey">
                    <el-table-column align="center" width="50" label="操作" fixed v-if="columnShow">
                      <template slot-scope="{row}">
                        <span style="color:#0186ef;cursor:pointer" @click="deltableDataUp4(row)">删除</span>
                      </template>
                    </el-table-column>
                    <el-table-column align="center" type="selection" width="55" fixed
                      v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown3.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
              </el-tabs>
            </div>
            <!-- <div style="height:15px;background-color:#d5e4fb;"></div> -->
            <div class="container2" style="height:290px" >
              <div class="searchBox">
                <!-- <el-form :inline="true">
                  <el-form-item>
                    <el-input clearable placeholder="请输入查询内容"></el-input>
                  </el-form-item>
                  <el-form-item>
                    <el-button size="mini" type="primary">查询</el-button>
                  </el-form-item>
                </el-form> -->
              </div>
              <el-tabs v-model="firstActiveName2" type="card" @tab-click="handleClick">
                <el-tab-pane label="Autocheck表" name="first-first2">
                  <el-table v-loading="downLoading" ref="multipleTableAutocheck1"
                    :data="tableDataDown.contentList && tableDataDown.contentList.slice((currentPage1 - 1) * pageSize1, currentPage1 * pageSize1)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" :row-key="getRowKey"
                    @select="isSelect" @select-all="selectAll">
                    <el-table-column align="center" type="selection" width="55" fixed reserve-selection
                      :selectable="selectableFunc" v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="重点关注菌种表" name="first-second2">
                  <el-table v-loading="downLoading" ref="multipleTableAutocheck2"
                    :data="tableDataDown.contentList && tableDataDown.contentList.slice((currentPage2 - 1) * pageSize2, currentPage2 * pageSize2)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" :row-key="getRowKey"
                    @select="isSelect" @select-all="selectAll">
                    <el-table-column align="center" type="selection" width="55" :selectable="selectableFunc" fixed
                      :reserve-selection="true" v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="常规表" name="first-third2">
                  <el-table v-loading="downLoading" ref="multipleTableAutocheck3"
                    :data="tableDataDown.contentList && tableDataDown.contentList.slice((currentPage3 - 1) * pageSize3, currentPage3 * pageSize3)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" :row-key="getRowKey"
                    @select="isSelect" @select-all="selectAll">
                    <el-table-column align="center" type="selection" width="55" :selectable="selectableFunc" fixed
                      :reserve-selection="true" v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="原始表" name="first-fourth2">
                  <el-table v-loading="downLoading" ref="multipleTableAutocheck4"
                    :data="tableDataDown.contentList && tableDataDown.contentList.slice((currentPage4 - 1) * pageSize4, currentPage4 * pageSize4)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" :row-key="getRowKey"
                    @select="isSelect" @select-all="selectAll">
                    <el-table-column align="center" type="selection" width="55" :reserve-selection="true"
                      :selectable="selectableFunc" fixed v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="疑似强阳表" name="first-fifth2">
                  <el-table ref="multipleTableAutocheck5"
                    :data="tableDataDown2.contentList && tableDataDown2.contentList.slice((currentPage5 - 1) * pageSize5, currentPage5 * pageSize5)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190">
                    <!-- <el-table-column align="center" type="selection" width="55" fixed></el-table-column> -->
                    <el-table-column align="center" v-for="(item, index) in tableDataDown2.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="疑似背景表" name="first-sixth2">
                  <el-table ref="multipleTableAutocheck6"
                    :data="tableDataDown2.contentList && tableDataDown2.contentList.slice((currentPage6 - 1) * pageSize6, currentPage6 * pageSize6)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190">
                    <!-- <el-table-column align="center" type="selection" width="55" fixed></el-table-column> -->
                    <el-table-column align="center" v-for="(item, index) in tableDataDown2.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="背景表" name="first-seventh2">
                  <el-table ref="multipleTableAutocheck7"
                    :data="tableDataDown2.contentList && tableDataDown2.contentList.slice((currentPage7 - 1) * pageSize7, currentPage7 * pageSize7)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190">
                    <!-- <el-table-column align="center" type="selection" width="55" fixed></el-table-column> -->
                    <el-table-column align="center" v-for="(item, index) in tableDataDown2.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="耐药基因" name="first-eighth2">
                  <el-table ref="multipleTableAutocheck8"
                    :data="tableDataDown3.contentList && tableDataDown3.contentList.slice((currentPage8 - 1) * pageSize8, currentPage8 * pageSize8)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" @select='isSelect'
                    :row-key="getRowKey" @select-all="selectAll3">
                    <el-table-column align="center" type="selection" width="55" fixed :selectable="selectableFunc2"
                      :reserve-selection="true" v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown3.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <el-tab-pane label="毒力基因" name="first-ninth2">
                  <el-table ref="multipleTableAutocheck9"
                    :data="tableDataDown3.contentList && tableDataDown3.contentList.slice((currentPage9 - 1) * pageSize9, currentPage9 * pageSize9)"
                    tooltip-effect="dark" style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="190" @select="isSelect"
                    :row-key="getRowKey" @select-all="selectAll4">
                    <el-table-column align="center" type="selection" width="55" fixed :selectable="selectableFunc3"
                      :reserve-selection="true" v-if="columnShow"></el-table-column>
                    <el-table-column align="center" v-for="(item, index) in tableDataDown3.headList" :key="index"
                      :label="item" width="200" show-overflow-tooltip>
                      <template slot-scope="scope">
                        {{ scope.row[index] }}
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
              </el-tabs>
            </div>                       
          </div>
            <el-dialog :visible.sync="addRemarkDialog" style="margin-top:15vh;" title="添加备注" width="500px">
              <el-input clearable type="textarea" :rows="12" placeholder="请输入备注(必填)"
                v-model="processContent"></el-input>

              <span slot="footer" class="dialog-footer">
                <el-button size="mini" @click="addRemarkDialog = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="sureToAddRemark">确 定</el-button>
              </span>
            </el-dialog>
            <el-dialog :visible.sync="cancelSubmitReasonDialog" style="margin-top:15vh;" title="取消提交原因" width="500px">
              <el-input clearable type="textarea" :rows="12" placeholder="请输入取消提交原因(必填)"
                v-model="processContent"></el-input>

              <span slot="footer" class="dialog-footer">
                <el-button size="mini" @click="cancelSubmitReasonDialog = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="cancelSubmitReport">确 定</el-button>
              </span>
            </el-dialog>
          </el-tab-pane>
          <el-tab-pane label="基本信息" name="eighth">
            <!-- <basicInfoCom :detail-son="detail" ref="basicInfoRef"></basicInfoCom> -->
            <div class="basicInfoBox" style="height: 720px;">
              <el-form :inline="true" label-width="100px">


                <el-form-item label="条码号">
                  <el-input v-model="baseRuleForm.barcodeCode" disabled></el-input>
                </el-form-item>


                <el-form-item label="实验编号">
                  <el-input v-model="baseRuleForm.experimentNumber" disabled></el-input>
                </el-form-item>


                <el-form-item label="平台类型">
                  <el-input v-model="baseRuleForm.platformTypeName" disabled></el-input>
                </el-form-item>



                <el-form-item label="核酸类型">
                  <el-input v-model="baseRuleForm.nucleicTypeName" disabled></el-input>
                </el-form-item>


                <el-form-item label="状态">
                  <el-input v-model="mainStateObj2[baseRuleForm.mainState]" disabled></el-input>
                </el-form-item>


                <el-form-item label="专业组">
                  <el-input v-model="professionalList[baseRuleForm.professionalGroupId]" disabled></el-input>
                </el-form-item>



                <el-form-item label="项目类型">
                  <el-input v-model="baseRuleForm.projectTypeName" disabled></el-input>
                </el-form-item>


                <el-form-item label="样本类型">
                  <el-input v-model="baseRuleForm.sampleTypeName" disabled></el-input>
                </el-form-item>


                <el-form-item label="送检单位">
                  <el-input v-model="baseRuleForm.inspectionUnit" disabled></el-input>
                </el-form-item>



                <el-form-item label="送检姓名">
                  <el-input v-model="baseRuleForm.submitName" disabled></el-input>
                </el-form-item>


                <el-form-item label="性别">
                  <el-input v-model="sexObj[baseRuleForm.targetSex]" disabled></el-input>
                </el-form-item>


                <el-form-item label="年龄">
                  <el-input v-model="baseRuleForm.age" disabled></el-input>
                </el-form-item>



                <el-form-item label="手机号码">
                  <el-input v-model="baseRuleForm.phone" disabled></el-input>
                </el-form-item>


                <el-form-item label="合作单位">
                  <el-input v-model="baseRuleForm.cooperation" disabled></el-input>
                </el-form-item>


                <el-form-item label="采样日期">
                  <el-input v-model="baseRuleForm.collectorTime" disabled></el-input>
                </el-form-item>



                <el-form-item label="申请日期">
                  <el-input v-model="baseRuleForm.applyDate" disabled></el-input>
                </el-form-item>


                <el-form-item label="录单人">
                  <el-input v-model="baseRuleForm.recordName" disabled></el-input>
                </el-form-item>


                <el-form-item label="录单日期">
                  <el-input v-model="baseRuleForm.recordTime" disabled></el-input>
                </el-form-item>


                <el-form-item label="备注">
                  <el-input v-model="baseRuleForm.remark" disabled type="textarea" style="width:450px"></el-input>
                </el-form-item>
                <el-menu class="el-menu-vertical-demo" :default-openeds="['1']">
                  <el-submenu index="1">
                    <template slot="title">
                      <span>临床信息</span>
                    </template>
                    <el-form :inline="true" label-width="100px">


                      <el-form-item label="白细胞(10⁹/L)">
                        <el-input v-model="baseRuleForm.whiteBloodCells"></el-input>
                      </el-form-item>


                      <el-form-item label="中性粒(%)">
                        <el-input v-model="baseRuleForm.neutralGrain"></el-input>
                      </el-form-item>


                      <el-form-item label="淋巴细胞(%)">
                        <el-input v-model="baseRuleForm.lymphocyte"></el-input>
                      </el-form-item>



                      <el-form-item label="CRP(mg/L)">
                        <el-input v-model="baseRuleForm.crp"></el-input>
                      </el-form-item>



                      <el-form-item label="PCT(mg/L)">
                        <el-input v-model="baseRuleForm.pct"></el-input>
                      </el-form-item>



                      <el-form-item label="前端备注">
                        <el-input v-model="baseRuleForm.frontendNote"></el-input>
                      </el-form-item>



                      <el-form-item label="提取浓度">
                        <el-input v-model="baseRuleForm.extractionConcentration"></el-input>
                      </el-form-item>



                      <el-form-item label="宿主率">
                        <el-input v-model="baseRuleForm.rateOfHost"></el-input>
                      </el-form-item>


                      <el-form-item label="主诉">
                        <el-input v-model="baseRuleForm.principalComplaint"></el-input>
                      </el-form-item>



                      <el-form-item label="临床诊断">
                        <el-input v-model="baseRuleForm.clinicalDiagnosis"></el-input>
                      </el-form-item>


                      <el-form-item label="用药">
                        <el-input v-model="baseRuleForm.medication"></el-input>
                      </el-form-item>


                      <el-form-item label="重点病原">
                        <el-input v-model="baseRuleForm.focusOnPathogen"></el-input>
                      </el-form-item>



                      <el-form-item label="鉴定结果">
                        <el-input v-model="baseRuleForm.cultureIdentificationResults"></el-input>
                      </el-form-item>


                      <el-form-item label="发病时长">
                        <el-input v-model="baseRuleForm.onsetTime"></el-input>
                      </el-form-item>


                      <el-form-item label="DNA结果">
                        <el-input v-model="baseRuleForm.resultDna"></el-input>
                      </el-form-item>


                      <el-form-item label="DNA检出病原">
                        <el-input v-model="baseRuleForm.resultDnaOn"></el-input>
                      </el-form-item>


                      <el-form-item label="RNA结果">
                        <el-input v-model="baseRuleForm.resultRna"></el-input>
                      </el-form-item>


                      <el-form-item label="RNA检出病原">
                        <el-input v-model="baseRuleForm.resultRnaOn"></el-input>
                      </el-form-item>


                    </el-form>
                  </el-submenu>
                </el-menu>

              </el-form>
            </div>
          </el-tab-pane>
          <el-tab-pane label="预览报告" name="second">
            <div class="container3" style="padding:5px">
              <!-- <div class="demo-image__preview">
                <el-image style="height: 100%;width:60%;cursor:pointer" :src="url" @click="openScanReportUrl"
                  v-if="scanReportUrl" title='点击查看预览报告'></el-image>
              </div> -->
              <iframe id='content' :src='scanReportUrl' style="width:100%;height:100%" v-if="scanReportUrl"></iframe>
            </div>
          </el-tab-pane>
          <el-tab-pane label="申请单图片" name="third">
            <div class="container3">
              <div class="demo-image__preview" v-for="el in applyList">
                <!-- <i class="el-icon-circle-close"></i> -->
                <el-image style="width: 300px;height:300px;margin-top:10px" :src="el"
                  :preview-src-list="applyList"></el-image>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="比对表" name="fourth">
            <div class="container4">
              <!-- <div class="container4_1"> -->
                <el-table ref="multipleTable" :data="compareTableData.contentList" tooltip-effect="dark"
                  style="width: 100%;" border :header-cell-style="{
                    background: '#ebebeb'
                  }" highlight-current-row :row-class-name="rowStyle" :height="heights2">
                  <el-table-column align="center" type="index" width="55" label="序号"
                    v-if='columnShow2'></el-table-column>
                  <el-table-column min-width="200" align="center" v-for="(item, index) in compareTableData.headList"
                    :key="index" :label="item" show-overflow-tooltip>
                    <template slot-scope="{row}">{{ row[index] }}</template>
                  </el-table-column>
                </el-table>
              <!-- </div> -->
            </div>
          </el-tab-pane>
          <el-tab-pane label="构图" name="fifth">
            <div class="container3">
              <div class="demo-image__preview" v-for="el in urlList">
                <!-- <i class="el-icon-circle-close"></i> -->
                <el-image style="width: 300px;height:300px;margin-top:10px" :src="el"
                  :preview-src-list="urlList"></el-image>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="备注" name="sixth">
            <div class="container4">
              <!-- <div class="container4_1"> -->
                <el-table ref="multipleTable" :data="remarkTableData" tooltip-effect="dark" style="width: 100%;" border
                  :header-cell-style="{
                    background: '#ebebeb'
                  }" highlight-current-row :row-class-name="rowStyle" :height="heights2">
                  <el-table-column align="center" type="index" width="55" label="序号"></el-table-column>
                  <el-table-column prop="remark" label="备注内容" show-overflow-tooltip align="center">
                  </el-table-column>
                  <el-table-column width="300" align="center" prop="processDate" label="操作时间"></el-table-column>
                  <el-table-column width="200" align="center" prop="processPerson" label="操作人"></el-table-column>
                  <el-table-column width="200" align="center" prop="deptName" label="操作部门"></el-table-column>
                </el-table>
              <!-- </div> -->
            </div>
          </el-tab-pane>
          <el-tab-pane label="操作日志" name="seventh">
            <div class="container4">
              <!-- <div class="container4_1"> -->
                <el-table ref="multipleTable" :data="logTableData" tooltip-effect="dark" style="width: 100%;" border
                  :header-cell-style="{
                    background: '#ebebeb'
                  }" highlight-current-row :row-class-name="rowStyle" :height="heights2">
                  <el-table-column align="center" type="index" width="55" label="序号"></el-table-column>
                  <el-table-column width="150" prop="mainState" label="操作类型" show-overflow-tooltip align="center">
                    <template slot-scope="{row}">{{ mainStateObj2[row.mainState] }}</template>
                  </el-table-column>
                  <el-table-column show-overflow-tooltip align="center" prop="processContent"
                    label="操作内容"></el-table-column>
                  <el-table-column width="300" align="center" prop="processDate" label="操作时间"></el-table-column>
                  <el-table-column width="150" align="center" prop="processPerson" label="操作人"></el-table-column>
                  <el-table-column width="150" align="center" prop="deptName" label="操作部门"></el-table-column>
                  
                </el-table>
              <!-- </div> -->
            </div>
          </el-tab-pane>
        </el-tabs>
        <!-- <div style="height:30px;width:100px;border:1px solid blue"></div> -->
        <div class="block">
          <div>
            <el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1"
              :current-page="currentPage1" :page-sizes="[30]" :page-size="pageSize1"
              layout="total, sizes, prev, pager, next, jumper" :total="total1" style="margin-top:10px"
              v-show="tabIndex3 === 0"></el-pagination>
            <el-pagination @size-change="handleSizeChange2" @current-change="handleCurrentChange2"
              :current-page="currentPage2" :page-sizes="[30]" :page-size="pageSize2"
              layout="total, sizes, prev, pager, next, jumper" :total="total2" style="margin-top:10px"
              v-show="tabIndex3 === 1"></el-pagination>
            <el-pagination @size-change="handleSizeChange3" @current-change="handleCurrentChange3"
              :current-page="currentPage3" :page-sizes="[30]" :page-size="pageSize3"
              layout="total, sizes, prev, pager, next, jumper" :total="total3" style="margin-top:10px"
              v-show="tabIndex3 === 2"></el-pagination>
            <el-pagination @size-change="handleSizeChange4" @current-change="handleCurrentChange4"
              :current-page="currentPage4" :page-sizes="[30]" :page-size="pageSize4"
              layout="total, sizes, prev, pager, next, jumper" :total="total4" style="margin-top:10px"
              v-show="tabIndex3 === 3">
            </el-pagination>
            <el-pagination @size-change="handleSizeChange5" @current-change="handleCurrentChange5"
              :current-page="currentPage5" :page-sizes="[30]" :page-size="pageSize5"
              layout="total, sizes, prev, pager, next, jumper" :total="total5" style="margin-top:10px"
              v-show="tabIndex3 === 4">
            </el-pagination>
            <el-pagination @size-change="handleSizeChange6" @current-change="handleCurrentChange6"
              :current-page="currentPage6" :page-sizes="[30]" :page-size="pageSize6"
              layout="total, sizes, prev, pager, next, jumper" :total="total6" style="margin-top:10px"
              v-show="tabIndex3 === 5">
            </el-pagination>
            <el-pagination @size-change="handleSizeChange7" @current-change="handleCurrentChange7"
              :current-page="currentPage7" :page-sizes="[30]" :page-size="pageSize7"
              layout="total, sizes, prev, pager, next, jumper" :total="total7" style="margin-top:10px"
              v-show="tabIndex3 === 6">
            </el-pagination>
            <el-pagination @size-change="handleSizeChange8" @current-change="handleCurrentChange8"
              :current-page="currentPage8" :page-sizes="[30]" :page-size="pageSize8"
              layout="total, sizes, prev, pager, next, jumper" :total="total8" style="margin-top:10px"
              v-show="tabIndex3 === 7">
            </el-pagination>
            <el-pagination @size-change="handleSizeChange9" @current-change="handleCurrentChange9"
              :current-page="currentPage9" :page-sizes="[30]" :page-size="pageSize9"
              layout="total, sizes, prev, pager, next, jumper" :total="total9" style="margin-top:10px"
              v-show="tabIndex3 === 8">
            </el-pagination>
          </div>
        </div>
      </div>
    </div>
    <!-- 回退 -->
    <el-dialog :visible.sync="returnDialog" width="750px" title="回退申请" class="returnForm">
      <el-form :model="returnData" :rules="rules3" ref="ruleForm3" label-width="110px" class="demo-ruleForm"
        :inline="true">
        <el-form-item label="条码号">
          <el-input clearable style="width:210px" v-model="returnData.barcodeCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="项目类型">
          <el-input clearable style="width:210px" v-model="returnData.projectTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="实验编号">
          <el-input clearable style="width:210px" v-model="returnData.experimentNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="样本状态">
          <!-- <el-input clearable style="width:210px" v-model="arr.extractStateObj[returnData.extractState]" disabled></el-input> -->
          <el-input clearable style="width:210px" v-model="arr.mainStateObj[returnData.mainState]" disabled></el-input>
        </el-form-item>
        <el-form-item label="分析样本编号">
          <el-input clearable style="width:210px" v-model="returnData.analyzeSampleNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="分析批次号">
          <el-input clearable style="width:210px" v-model="returnData.analyzeBatchNumber" disabled></el-input>
        </el-form-item>
        <el-form-item label="核酸类型">
          <el-input clearable style="width:210px" v-model="returnData.nucleicTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="样本类型">
          <el-input clearable style="width:210px" v-model="returnData.sampleTypeName" disabled></el-input>
        </el-form-item>
        <el-form-item label="送检姓名">
          <el-input clearable style="width:210px" v-model="returnData.submitName" disabled></el-input>
        </el-form-item>
        <el-form-item label="送检单位">
          <el-input clearable style="width:210px" v-model="returnData.inspectionUnit" disabled></el-input>
        </el-form-item>
        <el-form-item label="回退环节" prop="flowBackState">
          <el-radio-group v-model="returnData.flowBackState">
            <el-radio :label="2">入库</el-radio>
            <el-radio :label="3">提取</el-radio>
            <el-radio :label="4">建库</el-radio>
            <el-radio :label="5">测序</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="回退原因" prop="fallbackReason">
          <el-input clearable v-model="returnData.fallbackReason" placeholder="请输入回退原因" style="width:210px"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="resetRegister('ruleForm3')">取消</el-button>
        <el-button size="mini" type="primary" @click="submitRegister3('ruleForm3')">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog :visible.sync="nullifyDialog" style="margin-top:15vh;" title="提示" width="500px">
      <el-form :model="ruleForm2" :rules="rules2" class="demo-ruleForm" ref="ruleForm2" :inline="true">
        <el-form-item label="请输入作废原因" prop="dictReasonId">
          <el-select v-model="ruleForm2.dictReasonId" placeholder="请选择" style="width:320px">
            <el-option v-for="item in Arr.reasonNameArr" :key="item.id" :label="item.reasonName"
              :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="nullifyDialog = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="sureToNullify('ruleForm2')">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 迟发申请 -->
    <el-dialog :visible.sync="lateDialog" width="1250px" title="迟发申请">
      <el-form :inline="true">
        <el-form-item>
          <el-button type="primary" size='mini' @click="manageLateAdd">新增</el-button>
        </el-form-item>
      </el-form>
      <el-table ref="multipleTableLate" :data="lateTableData" tooltip-effect="dark" style="width: 100%"
        @row-click="handleTableClick" border :header-cell-style="{ background: '#ebebeb' }" highlight-current-row
        height="410" :row-class-name="rowStyle" v-loading="loading">

        <el-table-column align="center" type="index" width="50" label="序号"></el-table-column>
        <el-table-column width="120" align="center" label="条码号" prop="barcodeCode"></el-table-column>
        <el-table-column width="100" align="center" prop="status" label="状态">
          <template slot-scope='{row}'>
            {{ row.status == 1 ? '已审核' : '未审核' }}
          </template>
        </el-table-column>
        <el-table-column width="150" align="center" prop="phone" label="联系方式"></el-table-column>
        <el-table-column width="250" align="center" prop="reasonContent" label="申请原因" show-overflow-tooltip>
        </el-table-column>
        <el-table-column width="250" align="center" prop="expectedReportTime" label="预计报告时间"></el-table-column>
        <el-table-column width="100" align="center" prop="userName" label="申请人"></el-table-column>
        <el-table-column width="250" align="center" prop="createTime" label="申请时间"></el-table-column>
        <el-table-column align="center" label="操作" width="200" fixed="right">
          <template slot-scope="scope">
            <div class="czDiv">
              <span style="color:#0186ef;cursor:pointer" @click.stop="manageLateView(scope.row)">审核</span>
              <span style="color:#0186ef;cursor:pointer" @click.stop="manageLateEdit(scope.row)">编辑</span>
              <span style="color:red;cursor:pointer" @click.stop="manageLateDel(scope.row)">删除</span>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <el-dialog :visible.sync="lateAddDialog" width="450px" :title="lateTitle" class="returnForm" append-to-body>
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
          <el-form-item label="申请人" prop="userId">
            <el-autocomplete class="inline-input" v-model="ruleForm.userName" :fetch-suggestions="querySearch"
              placeholder="请选择" @select="handleSelectUser" @focus="change(1)" style="width:228px"
              clearable></el-autocomplete>
            <!-- <el-select v-model="ruleForm.userId" placeholder="请选择" style="width:210px">
              <el-option v-for="item in userList" :key="item.userId" :label="item.userName"
                :value="item.userId"></el-option>
            </el-select> -->
          </el-form-item>
          <el-form-item label="联系方式">
            <el-input clearable placeholder="请输入联系方式" v-model="ruleForm.phone" style="width:210px" disabled></el-input>
          </el-form-item>
          <el-form-item label="申请原因" prop="reasonId">
            <el-select v-model="ruleForm.reasonId" placeholder="请选择" style="width:210px">
              <el-option v-for="item in lateReason" :key="item.id" :label="item.reasonName"
                :value="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="预计报告时间" prop="expectedReportTime">
            <el-date-picker v-model="ruleForm.expectedReportTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetime"
              placeholder="选择日期时间" style="width:210px">
            </el-date-picker>
          </el-form-item>

        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button size="mini" @click="resetRegister('ruleForm')">取消</el-button>
          <el-button size="mini" type="primary" @click="submitRegister('ruleForm')">确定</el-button>
        </span>
      </el-dialog>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="(lateDialog = false)">关闭</el-button>
      </span>

    </el-dialog>
    <!-- relation -->
    <el-dialog :visible.sync="relationDialog" width="1400px" title="关联病例">
      <div class="relationDiv">
        <div class="relationAside">
          <el-table ref="multipleTableRelation" :data="relationData" tooltip-effect="dark" style="width: 100%"
            @row-click="handleClickRelation" border :header-cell-style="{ background: '#ebebeb' }" highlight-current-row
            :height="heights2" :row-class-name="rowStyle" v-loading="loading">

            <el-table-column align="center" type="index" width="50" label="序号"></el-table-column>
            <el-table-column width="120" align="center" label="条码号" prop="barcodeCode"></el-table-column>

            <el-table-column width="80" align="center" prop="submitName" label="姓名"></el-table-column>
            <el-table-column width="350" align="center" prop="projectTypeName" label="项目类型" show-overflow-tooltip>
            </el-table-column>
            <el-table-column width="100" align="center" prop="mainState" label="检测流程">
              <template slot-scope='{row}'>
                {{ mainStateObj[row.mainState] }}
              </template>
            </el-table-column>
            <el-table-column width="200" align="center" prop="experimentNumber" label="实验编号"></el-table-column>
            <el-table-column width="100" align="center" prop="mainState" label="状态">
              <template slot-scope="{row}">
                {{ mainStateObj[row.mainState] }}
              </template>
            </el-table-column>
            <el-table-column width="250" align="center" prop="analyzeSampleNumber" label="分析样本编号"></el-table-column>
            <el-table-column width="150" align="center" prop="analyzeBatchNumber" label="分析批次号"></el-table-column>

          </el-table>
        </div>
        <div class="relationMain">
          <el-tabs v-model="activeNameRelation" type="card">

            <el-tab-pane label="基本信息" name="activeNameRelation1">

              <div class="basicInfoBox">

                <el-form :inline="true" label-width="100px">


                  <el-form-item label="条码号">
                    <el-input v-model="relationRow.barcodeCode" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="实验编号">
                    <el-input v-model="relationRow.experimentNumber" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="平台类型">
                    <el-input v-model="relationRow.platformTypeName" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="核酸类型">
                    <el-input v-model="relationRow.nucleicTypeName" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="状态">
                    <el-input v-model="mainStateObj2[relationRow.mainState]" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="专业组">
                    <el-input v-model="professionalList[relationRow.professionalGroupId]" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="项目类型">
                    <el-input v-model="relationRow.projectTypeName" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="样本类型">
                    <el-input v-model="relationRow.sampleTypeName" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="送检单位">
                    <el-input v-model="relationRow.inspectionUnit" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="送检姓名">
                    <el-input v-model="relationRow.submitName" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="性别">
                    <el-input v-model="sexObj[relationRow.targetSex]" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="年龄">
                    <el-input v-model="relationRow.age" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="手机号码">
                    <el-input v-model="relationRow.phone" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="合作单位">
                    <el-input v-model="relationRow.cooperation" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="采样日期">
                    <el-input v-model="relationRow.collectorTime" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="申请日期">
                    <el-input v-model="relationRow.applyDate" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="录单人">
                    <el-input v-model="relationRow.recordName" disabled></el-input>
                  </el-form-item>


                  <el-form-item label="录单日期">
                    <el-input v-model="relationRow.recordTime" disabled></el-input>
                  </el-form-item>



                  <el-form-item label="备注">
                    <el-input v-model="relationRow.remark" disabled type="textarea" style="width:450px"></el-input>
                  </el-form-item>
                  <el-menu class="el-menu-vertical-demo" :default-openeds="['1']">
                    <el-submenu index="1">
                      <template slot="title">
                        <span>临床信息</span>
                      </template>



                      <el-form-item label="白细胞(10⁹/L)">
                        <el-input v-model="relationRow.whiteBloodCells"></el-input>
                      </el-form-item>


                      <el-form-item label="中性粒(%)">
                        <el-input v-model="relationRow.neutralGrain"></el-input>
                      </el-form-item>


                      <el-form-item label="淋巴细胞(%)">
                        <el-input v-model="relationRow.lymphocyte"></el-input>
                      </el-form-item>



                      <el-form-item label="CRP(mg/L)">
                        <el-input v-model="relationRow.crp"></el-input>
                      </el-form-item>



                      <el-form-item label="PCT(mg/L)">
                        <el-input v-model="relationRow.pct"></el-input>
                      </el-form-item>



                      <el-form-item label="前端备注">
                        <el-input v-model="relationRow.frontendNote"></el-input>
                      </el-form-item>



                      <el-form-item label="提取浓度">
                        <el-input v-model="relationRow.extractionConcentration"></el-input>
                      </el-form-item>



                      <el-form-item label="宿主率">
                        <el-input v-model="relationRow.rateOfHost"></el-input>
                      </el-form-item>


                      <el-form-item label="主诉">
                        <el-input v-model="relationRow.principalComplaint"></el-input>
                      </el-form-item>



                      <el-form-item label="临床诊断">
                        <el-input v-model="relationRow.clinicalDiagnosis"></el-input>
                      </el-form-item>


                      <el-form-item label="用药">
                        <el-input v-model="relationRow.medication"></el-input>
                      </el-form-item>


                      <el-form-item label="重点病原">
                        <el-input v-model="relationRow.focusOnPathogen"></el-input>
                      </el-form-item>



                      <el-form-item label="鉴定结果">
                        <el-input v-model="relationRow.cultureIdentificationResults"></el-input>
                      </el-form-item>


                      <el-form-item label="发病时长">
                        <el-input v-model="relationRow.onsetTime"></el-input>
                      </el-form-item>


                      <el-form-item label="DNA结果">
                        <el-input v-model="relationRow.resultDna"></el-input>
                      </el-form-item>


                      <el-form-item label="DNA检出病原">
                        <el-input v-model="relationRow.resultDnaOn"></el-input>
                      </el-form-item>


                      <el-form-item label="RNA结果">
                        <el-input v-model="relationRow.resultRna"></el-input>
                      </el-form-item>


                      <el-form-item label="RNA检出病原">
                        <el-input v-model="relationRow.resultRnaOn"></el-input>
                      </el-form-item>
                    </el-submenu>
                  </el-menu>
                </el-form>
              </div>
            </el-tab-pane>
            <el-tab-pane label="预览报告" name="activeNameRelation2">
              <div class="container3" style="justify-content:flex-start;height:60vh">
                <div class="demo-image__preview">
                  <el-image style="height: 100%;width:60%;cursor:pointer" :src="url" @click="openRelationScanReportUrl"
                    v-if="relationScanReportUrl" title='点击查看预览报告'></el-image>
                </div>
              </div>
            </el-tab-pane>
            <el-tab-pane label="申请单图片" name="activeNameRelation3">
              <div class="container3" style="height:60vh">
                <div class="demo-image__preview" v-for="el in relationApplyList">
                  <!-- <i class="el-icon-circle-close"></i> -->
                  <el-image style="width: 300px;height:300px;margin-top:10px" :src="el"
                    :preview-src-list="relationApplyList"></el-image>
                </div>
              </div>
            </el-tab-pane>


            <el-tab-pane label="备注" name="activeNameRelation4">
              <div class="container4" style="height:65vh">
                <div class="container4_1" style="height:480px">
                  <el-table ref="multipleTable" :data="relationRemarkTableData" tooltip-effect="dark"
                    style="width: 100%;" border :header-cell-style="{
                      background: '#ebebeb'
                    }" highlight-current-row :row-class-name="rowStyle" height="450">
                    <el-table-column align="center" type="index" width="55" label="序号"></el-table-column>
                    <el-table-column prop="remark" label="备注内容" show-overflow-tooltip align="center">
                    </el-table-column>
                    <el-table-column width="300" align="center" prop="processDate" label="操作时间"></el-table-column>
                    <el-table-column width="200" align="center" prop="processPerson" label="操作人"></el-table-column>
                    <el-table-column width="200" align="center" prop="deptName" label="操作部门"></el-table-column>
                  </el-table>
                </div>
              </div>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="(relationDialog = false)">关闭</el-button>
      </span>

    </el-dialog>
  </div>
</template>

<script>
import { arr, Arr } from "@/utils/data.js";
import basicInfoCom from "@/components/microorganismReport/basicInfo.vue";
import { microorganismReadList, getQualityReport, editMicroorganismRead, confirmFirst, confirmReview, confirmAlreadyFirst, deleteFirst, deleteReview, addReport, submitReport, getAddReport, getReportPreview, getCompareTable, getCompareImage, getProcessLog, getTable, manageLate, unscrambleDetail, insertProcessLog, manageLateList, manageLateEdit, manageLateDel, listUser, reasonTemplate, cancelSubmitReport, save, getImageList, getProcessRemark, getReportPreview_test, relationList } from "@/api/reportReadManage/index.js";
import { manageBackList, manageBackAdd } from '@/api/comprehensiveSearchManage/fallback.js'
import {
  returnApply
} from "@/api/technologyManage/index.js";
import { voidPlaceOn, manageOperation } from '@/api/commonArr/index.js'
import { getToken } from "@/utils/auth";
export default {
  components: {
    basicInfoCom,
  },
  data() {
    return {
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now()
        },
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
            picker.$emit('pick', [start, end]);
          }
        }]
      },
      params: {
        pageSize: 20,
        pageNum: 1,
        projectType: '',
        mainState: ''
      },
      professionalList: {
        1: "高通量组",
        2: "肿瘤精准医学实验室",
        3: "感染综合诊断中心"
      },
      returnDialog: false,
      returnData: {},
      ruleForm: {},
      baseRuleForm: {},
      rules: {
        userId: [
          { required: true, message: "请选择申请人", trigger: "change" }
        ],
        expectedReportTime: [
          { required: true, message: "请选择预计时间", trigger: "blur" }
        ],
        reasonId: [
          { required: true, message: "请输入申请原因", trigger: "blur" }
        ],
      },
      columnShow: false,
      columnShow2: false,
      mainStateObj2: {
        1: "已录入",
        2: "已登记",
        3: "已入库",
        4: "已提取",
        5: "已建库",
        6: "已测序",
        7: "已分析",
        8: "初审中",
        9: "已确认初审",
        10: "已复审",
        11: "已提交",
        12: "已上传",
        13: "不上传"
      },
      mainStateObj: {
        7: "已分析",
        8: "初审中",
        9: "已确认初审",
        10: "已复审",
        11: "已提交",
        12: "已上传",
        13: "不上传"
      },
      rules2: {
        dictReasonId: [
          { required: true, message: "请输入作废原因", trigger: "change" }
        ]
      },
      ruleForm2: {},
      value1: [],
      projectType: "",
      tableData: [],
      remarkTableData: [],
      logTableData: [],
      nullifyDialog: false,
      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload",
      sexObj: {
        1: '男',
        2: '女',
        3: '不限制'
      },
      activeName: "first",
      firstActiveName1: "first-first",
      firstActiveName2: "first-first2",
      urlList: [],
      applyList: [],
      Arr: {},
      arr: {},
      ids: [],
      listTotal: 0,
      processContent: "",
      addRemarkDialog: false,
      cancelSubmitReasonDialog: false,
      processContent: "",
      multipleSelection: [],
      multipleSelection2: [],
      ids: [],
      isCollapse: true,
      listTitle: [],
      btnShow: false,
      loading: false,
      backReasonList: [],
      rules3: {
        fallbackReason: [
          { required: true, message: "请输入回退原因", trigger: "blur" }
        ],
        flowBackState: [
          { required: true, message: "请选择回退环节", trigger: "change" }
        ]
      },
      reportUrl: '',
      stateId: '',
      upload: {
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
      },
      uploadDisabled: true,
      row: {},
      scanReportUrl: '', // 预览报告
      tableDatax: [],
      detail: {},
      name: '_pathogen.auto', //auto表等
      lateDialog: false,
      lateAddDialog: false,
      lateTitle: '',
      lateReason: [],
      tableDataDown: {},
      tableDataUp: {
        tableDataUp1: [],
        tableDataUp2: [],
        tableDataUp3: [],
        tableDataUp4: [],
      },
      tabIndex: 0, //病原列表
      tabIndex2: 0,//上面4个
      tabIndex3: 0, //下面9个
      compareTableData: {},
      userList: [],
      lateTableData: [],
      tableDataDown2: [],
      paramsArr: [],
      tableDataDown3: [],
      projectTypeList: [],
      total1: 0,
      currentPage1: 1,
      pageSize1: 30,
      total2: 0,
      currentPage2: 1,
      pageSize2: 30,
      total3: 0,
      currentPage3: 1,
      pageSize3: 30,
      total4: 0,
      currentPage4: 1,
      pageSize4: 30,
      total5: 0,
      currentPage5: 1,
      pageSize5: 30,
      total6: 0,
      currentPage6: 1,
      pageSize6: 30,
      total7: 0,
      currentPage7: 1,
      pageSize7: 30,
      total8: 0,
      currentPage8: 1,
      pageSize8: 30,
      total9: 0,
      currentPage9: 1,
      pageSize9: 30,
      restaurants: [],
      relationDialog: false,
      relationData: [],
      activeNameRelation: 'activeNameRelation1',
      relationRow: {},
      relationScanReportUrl: '',
      relationApplyList: [],
      relationRemarkTableData: [],
      relationTotal: '',
      downLoading: false,
      heights: undefined,
      heights2:undefined,
      heights3:undefined,
    };
  },
  
  methods: {
    handleClickRelation(row) {
      this.relationRow = row
      this.paramsArr[0].htsUnscrambleVo = row
      this.paramsArr[1].htsUnscrambleVo = row
      this.paramsArr[2].htsUnscrambleVo = row
      this.paramsArr[3].htsUnscrambleVo = row
      getReportPreview(this.paramsArr).then((res) => {
        console.log(res)
        let url = 'http://hyg01.cn:6946' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        this.relationScanReportUrl = url
      })
      getImageList({ barcodeCode: row.barcodeCode }).then(res => {
        this.relationApplyList = []
        res.data.map(el => {
          this.relationApplyList.push('https://lrp-interface.huayinlab.com' + el.url)
        })
      })
      getProcessRemark({ stateId: row.stateId }).then(res => {
        this.relationRemarkTableData = res.data
      })
    },
    relation() {
      this.relationDialog = true
    },
    listUser() {
      listUser().then(res => {
        console.log(res, '??');
        res.rows.map(el => {
          this.userList.push({
            value: el.userName,
            id: el.userId
          })
        })
        console.log(this.userList, 555);
      })
    },
    handleSelectUser(item) {
      this.ruleForm.userId = item.id
    },
    reasonTemplate() {
      reasonTemplate().then(res => {
        this.lateReason = []
        res.rows.map(el => {
          if (el.reasonType === 1) {
            this.lateReason.push(el)
          }
        })
      })
    },
    cellStyle({ row, column, rowIndex, columnIndex }) {
      if (row.mainState === 12) {
        return "background:#f4b183";
      } else if (row.mainState === 11) {
        return "background:#fcd967";
      } else if (row.mainState === 10) {
        return "background:#a9d18e";
      } else if (row.mainState === 8) {
        return "background:#9dc3e6";
      }
    },
    save() {
      this.detail.tableContent = {}
      this.detail.tableContent.tableDataUp1 = this.tableDataUp.tableDataUp1
      this.detail.tableContent.tableDataUp2 = this.tableDataUp.tableDataUp2
      this.detail.tableContent.tableDataUp3 = this.tableDataUp.tableDataUp3
      this.detail.tableContent.tableDataUp4 = this.tableDataUp.tableDataUp4
      this.detail.tableContent = JSON.stringify(this.detail.tableContent)
      save((this.detail)).then(() => {
        this.$message.success('保存成功')
        this.$nextTick(() => {
          this.$refs['multipleTable1'].toggleAllSelection()
          this.$refs['multipleTable2'].toggleAllSelection()
          this.$refs['multipleTable3'].toggleAllSelection()
          this.$refs['multipleTable4'].toggleAllSelection()
        })
      })
    },
    deltableDataUp1(row) {
      // console.log(row);
      if (this.tabIndex2 === 0) {
        const index = this.tableDataUp.tableDataUp1.findIndex((item) => item[0] === row[0]);
        if (index !== -1) {
          this.tableDataUp.tableDataUp1.splice(index, 1)

        }
      }
      if (this.tabIndex2 === 1) {
        this.tableDataUp.tableDataUp2.map((el, i) => {
          if (el === row) {
            this.tableDataUp.tableDataUp2.splice(i, 1)
          }
        })
      }
      this.tableDataDown.contentList.map((el, i) => {
        if (el[0] === row[0]) {
          if (this.tabIndex3 === 0) {
            this.$refs.multipleTableAutocheck1.toggleRowSelection(this.tableDataDown.contentList[i])
          }
          if (this.tabIndex3 === 1) {
            this.$refs.multipleTableAutocheck2.toggleRowSelection(this.tableDataDown.contentList[i])
          }
          if (this.tabIndex3 === 2) {
            this.$refs.multipleTableAutocheck3.toggleRowSelection(this.tableDataDown.contentList[i])
          }
          if (this.tabIndex3 === 3) {
            this.$refs.multipleTableAutocheck4.toggleRowSelection(this.tableDataDown.contentList[i])
          }

        }
      })
    },
    deltableDataUp3(row) {
      this.tableDataUp.tableDataUp3.map((el, i) => {
        if (el[0] === row[0]) {
          this.tableDataUp.tableDataUp3.splice(i, 1)
        }
      })
      this.tableDataDown3.contentList.map((el, i) => {
        if (el[0] === row[0]) {
          this.$refs.multipleTableAutocheck8.toggleRowSelection(this.tableDataDown3.contentList[i])
        }
      })
    },
    deltableDataUp4(row) {
      this.tableDataUp.tableDataUp4.map((el, i) => {
        if (el[0] === row[0]) {
          this.tableDataUp.tableDataUp4.splice(i, 1)
        }
      })
      this.tableDataDown3.contentList.map((el, i) => {
        if (el[0] === row[0]) {
          this.$refs.multipleTableAutocheck9.toggleRowSelection(this.tableDataDown3.contentList[i])
        }
      })
    },

    getTable() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error('请先点击表格数据')
        return
      }
      let data = {
        analyzeBatchNumber: this.row.analyzeBatchNumber,
        analyzeSampleNumber: this.row.analyzeSampleNumber,
        name: this.name
      }
      let that = this
      this.downLoading = true
      getTable(data).then(res => {
        if (res.data.data.length != 0) {
          this.columnShow = true
        }
        if (that.tabIndex3 === 4) {
          that.tableDataDown2 = res.data.data
          that.total5 = that.tableDataDown2.contentList.length
        }
        if (that.tabIndex3 === 5) {
          that.tableDataDown2 = res.data.data
          that.total6 = that.tableDataDown2.contentList.length
        }
        if (that.tabIndex3 === 6) {
          that.tableDataDown2 = res.data.data
          that.total7 = that.tableDataDown2.contentList.length
        }
        if (that.tabIndex3 === 0) {
          that.tableDataDown = res.data.data
          that.tableDataDown.contentList = res.data.data.contentList.slice(0, 60)
          that.total1 = that.tableDataDown.contentList.length
        }
        if (that.tabIndex3 === 1) {
          that.tableDataDown = res.data.data
          that.tableDataDown.contentList = res.data.data.contentList.slice(60, 120)
          console.log(that.tableDataDown.contentList);
          that.total2 = that.tableDataDown.contentList.length
        } if (that.tabIndex3 === 2) {
          that.tableDataDown = res.data.data
          that.tableDataDown.contentList = res.data.data.contentList.slice(120, 180)
          that.total3 = that.tableDataDown.contentList.length
        } if (that.tabIndex3 === 3) {
          that.tableDataDown = res.data.data
          that.tableDataDown.contentList = res.data.data.contentList.slice(180, 240)
          that.total4 = that.tableDataDown.contentList.length
        }
        if (that.tabIndex3 === 7) {
          that.tableDataDown3 = res.data.data
          that.total8 = that.tableDataDown3.contentList.length
        }
        if (that.tabIndex3 === 8) {
          that.tableDataDown3 = res.data.data
          that.total9 = that.tableDataDown3.contentList.length
        }
        this.downLoading = false
        // if (that.tabIndex2 === 0 ) {
        that.tableDataDown.contentList.map((row, i) => {
          const index = that.tableDataUp.tableDataUp1.findIndex((item) => item[0] === row[0])
          if (index != -1) {
            this.$nextTick(() => {
              this.$refs.multipleTableAutocheck1.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck2.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck3.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck4.toggleRowSelection(this.tableDataDown.contentList[i], true);
            })
          }
        })

        // }
        // if (that.tabIndex2 === 1) {
        that.tableDataDown.contentList.map((row, i) => {
          const index = that.tableDataUp.tableDataUp2.findIndex((item) => item[0] === row[0])
          if (index != -1) {
            this.$nextTick(() => {
              this.$refs.multipleTableAutocheck1.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck2.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck3.toggleRowSelection(this.tableDataDown.contentList[i], true);
              this.$refs.multipleTableAutocheck4.toggleRowSelection(this.tableDataDown.contentList[i], true);
            })
          }
        })

        // }
        if (that.tabIndex2 === 2) {
          that.tableDataDown3.contentList.map((row, i) => {
            const index = that.tableDataUp.tableDataUp3.findIndex((item) => item[0] === row[0]);
            if (index != -1) {
              this.$nextTick(() => {
                this.$refs['multipleTableAutocheck8'].toggleRowSelection(this.tableDataDown3.contentList[i], true);
              })
            }
          })
        }
        if (that.tabIndex2 === 3) {
          that.tableDataDown3.contentList.map((row, i) => {
            const index = that.tableDataUp.tableDataUp4.findIndex((item) => item[0] === row[0]);
            if (index != -1) {
              this.$nextTick(() => {
                this.$refs['multipleTableAutocheck9'].toggleRowSelection(this.tableDataDown3.contentList[i], true);
              })
            }
          })
        }

        this.$nextTick(() => {
          this.$refs['multipleTable1'].toggleAllSelection()
          this.$refs['multipleTable2'].toggleAllSelection()
          this.$refs['multipleTable3'].toggleAllSelection()
          this.$refs['multipleTable4'].toggleAllSelection()
        })

      })
    },
    getRowKey(row) {
      return row[0];
    },
    // getImageList() {
    //   getImageList({ barcodeCode: this.detail.barcodeCode }).then(res => {
    //     this.applyList = []
    //     res.data.map(el => {
    //       this.applyList.push('https://lrp-interface.huayinlab.com' + el.url)
    //     })
    //   })
    // },
    getProcessLog() {
      getProcessLog({ stateId: this.row.stateId }).then(res => {
        // console.log(res);
        this.logTableData = res.data
      })
    },
    getProcessRemark() {
      getProcessRemark({ stateId: this.row.stateId }).then(res => {
        // console.log(res);
        this.remarkTableData = res.data
      })
    },
    getCompareImage() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
        return
      }
      if (this.paramsArr.length === 0) {
        this.$message.error('请先勾选上面表格内容')
        return
      }

      this.$confirm("是否构图?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        getCompareImage(this.paramsArr).then(res => {
          this.$message.success('构图成功')
          // this.getList()
          this.urlList = []
          res.data.map(el => {
            // this.urlList.push('http://gaotongliang.mdshuzhi.com' + el.replace('/Web/WebData/Result/', '/analyze/'))
            this.urlList.push('http://hyg01.cn:6946' + el.replace('/Web/WebData/Result/', '/analyze/'))
          })
        })
      })

    },
    submitRegister(formName) {

      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.lateTitle === '新增') {
            this.ruleForm.status = 0
            this.ruleForm.stateId = this.detail.stateId
            manageLate(this.ruleForm).then(() => {
              this.$message.success("新增成功");
              this.lateAddDialog = false;
              this.openManageLate();
            });
          } else {
            manageLateEdit(this.ruleForm).then(() => {
              this.$message.success("编辑成功");
              this.lateAddDialog = false;
              this.openManageLate();
            })
          }

        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    openManageLate() {
      let data = {
        barcodeCode: this.detail.barcodeCode,
        pageNum: 1,
        pageSize: 20,
        stateId: this.detail.stateId
      }
      this.lateDialog = true
      this.loading = true
      manageLateList(data).then(res => {
        this.lateTableData = res.rows
        this.loading = false
      })
      this.listUser()
      this.reasonTemplate()

    },
    manageLateEdit(row) {
      console.log(row, 1111);
      this.ruleForm = row
      this.lateTitle = '编辑'
      this.lateAddDialog = true
    },
    manageLateView(row) {
      this.$confirm("是否审核?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        row.status = 1
        manageLateEdit(row).then(() => {
          this.$message.success('审核成功')
          this.openManageLate()
        })
      })
    },
    manageLateDel(row) {
      this.$confirm("是否删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        manageLateDel(row.id).then(() => {
          this.$message.success('删除成功')
          this.openManageLate()
        })
      })
    },
    manageLateAdd() {
      this.ruleForm = {}
      this.lateTitle = '新增'
      this.lateAddDialog = true
    },
    getCompareTable() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
        return
      }
      if (this.paramsArr.length === 0) {
        this.$message.error('请先勾选上面表格内容')
        return
      }

      this.$confirm("是否比对?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        console.log(this.paramsArr);
        // return
        // paramsArr[0]={
        //   contentList:
        // }
        getCompareTable(this.paramsArr).then(res => {
          console.log(res);
          this.compareTableData = res.data
          this.compareTableData.contentList.splice(0, 15)
          this.$message.success('比对成功')
          this.columnShow2 = true
          //   this.getList()
          //   let url = 'http://gaotongliang.mdshuzhi.com' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
          //   // window.open(url)
          // })
        })
      })

    },


    submitReport() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm("是否上传该报告到LRP?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          getAddReport({ stateId: this.row.stateId }).then(res => {
            this.reportUrl = res.data.reportUrl
          }).then(() => {
            submitReport({
              stateId: this.row.stateId,
              reportUrl: this.reportUrl
            }).then(() => {
              this.$message({
                type: "success",
                message: "上传成功!"
              })
              this.getList()
              this.voidPlaceOn2()
            })
          })
        });
      }

    },
    addReport() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.uploadDisabled = false
        this.stateId = this.row.stateId
      }

    },
    // 上传成功回调
    handleUploadSuccess(res) {
      // console.log("res:", res)
      this.reportUrl = res.data.url
      let params = {
        reportUrl: this.reportUrl,
        stateId: this.stateId
      }
      addReport(params).then(() => {
        this.$message.success('提交成功')
        this.getList()
        this.voidPlaceOn2()
      })
    },
    // 文件个数超出
    handleExceed() {
      this.$message.error(`上传文件数量不能超过 ${this.limit} 个!`);
    },
    confirmFirst() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm('是否初审?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          confirmFirst(this.row.stateId).then(() => {
            this.$message.success('初审成功')
            this.getList()

          })
        })
      }
    },
    confirmAlreadyFirst() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm('是否确认初审?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          confirmAlreadyFirst(this.row.stateId).then(() => {
            this.$message.success('确认初审成功')
            this.getList()
          })
        })

      }
    },
    confirmReview() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm('是否复审?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          confirmReview(this.row.stateId).then(() => {
            this.$message.success('复审成功')
            this.getList()
          })
        })

      }
    },
    deleteFirst() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm('是否删除初审?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          deleteFirst(this.row.stateId).then(() => {
            this.$message.success('删除初审成功')
            this.row.status = 0
            this.row.operationStatus = 4
            this.row.professionalGroup = this.row.professionalGroupId
            this.row.entryDate = this.row.inputDate
            this.row.sampleType = this.row.sampleTypeId
            this.row.registrationTime = this.row.registerCreateDate
            this.row.projectType = this.row.projectTypeId
            manageOperation(this.row)
            this.getList()
          })
        })

      }
    },
    deleteReview() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.$confirm('是否删除复审?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          deleteReview(this.row.stateId).then(() => {
            this.$message.success('删除复审成功')
            this.row.status = 0
            this.row.operationStatus = 5
            this.row.professionalGroup = this.row.professionalGroupId
            this.row.entryDate = this.row.inputDate
            this.row.sampleType = this.row.sampleTypeId
            this.row.registrationTime = this.row.registerCreateDate
            this.row.projectType = this.row.projectTypeId
            manageOperation(this.row)
            this.getList()
            console.log(this.row, 89898989);
          })
        })

      }
    },
    nullify() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
      } else {
        this.nullifyDialog = true
      }

    },
    voidPlaceOn() {
      voidPlaceOn({ stateId: this.stateId, status: 0 })
    },
    voidPlaceOn2() {
      voidPlaceOn({ stateId: this.stateId, status: 1 })
    },

    sureToNullify(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          let dictReasonId = this.ruleForm2.dictReasonId
          this.ruleForm2 = this.row
          this.ruleForm2.isVoid = 1
          this.ruleForm2.dictReasonId = dictReasonId
          editMicroorganismRead(this.ruleForm2).then(() => {
            this.$message.success("已作废");
            this.nullifyDialog = false;
            this.getList();
            this.voidPlaceOn()
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetRegister(formName) {
      this.$refs[formName].resetFields(); //清空
      this.returnDialog = false;
      this.lateAddDialog = false
    },

    submitRegister3(formName) {
      const data = {
        fallbackReason: this.returnData.fallbackReason,
        flowBackState: this.returnData.flowBackState,
        stateId: this.returnData.stateId
      };
      this.$refs[formName].validate(valid => {
        if (valid) {
          returnApply(data).then(() => {
            this.$message.success("回退成功");
            this.returnDialog = false;
            this.getList();
            this.row.backReason = this.returnData.fallbackReason
            this.row.status = this.returnData.flowBackState
            this.row.projectTypeId = this.row.projectType
            this.row.nucleicAcidTypeId = this.row.nucleicAcidType
            this.row.platformTypeId = this.row.platformType
            this.row.sampleTypeId = this.row.sampleType
            this.row.nucleicAcidTypeName = this.row.nucleicAcidName
            manageBackAdd(this.row)
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    returnBtn() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
        return;
      }
      this.returnDialog = true;
      this.returnData = this.row;
      manageBackList({ pageNum: 1, pageSize: 999 }).then(res => {
        this.backReasonList = res.rows
      })
    },
    getQualityReport() {
      if (Object.keys(this.row).length === 0) {
        this.$message.error("请点击表格内容");
        return
      }
      this.$confirm('是否确认获取质控报告?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        let qualityReportParmas = {
          analyzeBatchNumber: this.row.analyzeBatchNumber,
          analyzeSampleNumber: this.row.analyzeSampleNumber
        }
        return getQualityReport(qualityReportParmas)
      }).then(res => {
        // console.log(res.msg);
        // let url = 'http://gaotongliang.mdshuzhi.com' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        let url = 'http://hyg01.cn:6946' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        window.open(url)
      })
    },
    getReportPreview() {
      // if(this.paramsArr.length===0){
      //   this.$message.error('请先勾选上面表格内容')
      //   return
      // }
      getReportPreview(this.paramsArr).then((res) => {
        console.log(res)
        // let url = 'http://gaotongliang.mdshuzhi.com' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        let url = 'http://hyg01.cn:6946' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        this.scanReportUrl = url
        this.$message.success('获取报告成功')
        // let data={
        //   analyzeBatchNumber: this.row.analyzeBatchNumber,
        //   analyzeSampleNumber: this.row.analyzeSampleNumber
        // }
        // getReportPreview_test(data).then(res=>{
        //   console.log(res);
        // })
      })

    },
    // openScanReportUrl() {
    //   window.open(this.scanReportUrl)
    // },
    openRelationScanReportUrl() {
      window.open(this.relationScanReportUrl)
    },
    ctrlBtnShow() {
      this.btnShow = !this.btnShow;
    },
    // 切换时
    handleClick(tab) {
      if (tab.index == 0) {
        this.name = '_pathogen.auto'
        this.tabIndex3 = 0
      }
      if (tab.index == 1) {
        // this.name = '_pathogen.foc'
        this.name = '_pathogen.auto'
        this.tabIndex3 = 1
      }
      if (tab.index == 2) {
        // this.name = '_pathogen.nor'
        this.name = '_pathogen.auto'
        this.tabIndex3 = 2
      }
      if (tab.index == 3) {
        // this.name = '_pathogen'
        this.name = '_pathogen.auto'
        this.tabIndex3 = 3
      }
      if (tab.index == 4) {
        this.name = '_pathogen.ssp'
        this.tabIndex3 = 4
      }
      if (tab.index == 5) {
        this.name = '_pathogen.sbg'
        this.tabIndex3 = 5
      }
      if (tab.index == 6) {
        this.name = '_pathogen.bg'
        this.tabIndex3 = 6
      }
      if (tab.index == 7) {
        this.name = '_pathogen.dg'
        this.tabIndex3 = 7
      }
      if (tab.index == 8) {
        this.name = '_pathogen.vg'
        this.tabIndex3 = 8
      }
      this.getTable()
    },
    handleClick2(tab) {
      if (tab.index == 1) {
        this.tabIndex = 1
      }
      if (tab.index == 2) {
        this.tabIndex = 2
      }
      if (tab.index == 3) {
        this.tabIndex = 3
      }

      if (tab.index == 6) {
        this.tabIndex = 6
      }
      if (tab.index == 7) {
        this.tabIndex = 7
      }
    },
    handleClick3(tab) {
      if (tab.index == 0) {
        this.tabIndex2 = 0
      }
      if (tab.index == 1) {
        this.tabIndex2 = 1
      }
      if (tab.index == 2) {
        this.tabIndex2 = 2
      }
      if (tab.index == 3) {
        this.tabIndex2 = 3
      }
      if (this.tabIndex2 === 3 && this.tabIndex3 === 8) {
        this.tableDataUp.tableDataUp4.map(el => {
          this.tableDataDown3.contentList.map(it => {
            console.log(el[0] + '---' + it[0]);
          })
        })
      }
    },
    handleTableClick(row) {
      this.row = row
      this.stateId = row.stateId
      this.$refs.multipleTableAutocheck1.clearSelection();
      this.$refs.multipleTableAutocheck2.clearSelection();
      this.$refs.multipleTableAutocheck3.clearSelection();
      this.$refs.multipleTableAutocheck4.clearSelection();
      this.$refs.multipleTableAutocheck8.clearSelection();
      this.$refs.multipleTableAutocheck9.clearSelection();
      unscrambleDetail({ id: row.id }).then(res => {
        this.detail = res.data
        this.baseRuleForm = res.data
        console.log(this.detail, 'detail');
        // this.columnShow = true
        if (this.detail.tableContent === null) {
          this.tableDataUp = {
            tableDataUp1: [],
            tableDataUp2: [],
            tableDataUp3: [],
            tableDataUp4: [],
          }
        } else {
          this.tableDataUp = JSON.parse(this.detail.tableContent)
        }
        if (res.data.tableContent === null) {
          this.tableDataUp = {
            tableDataUp1: [],
            tableDataUp2: [],
            tableDataUp3: [],
            tableDataUp4: [],
          }
          this.tableDataDown = {}
          this.detail.tableContent = {
            tableDataUp1: [],
            tableDataUp2: [],
            tableDataUp3: [],
            tableDataUp4: [],
          }
        } else {
          this.$set(this.tableDataUp, 'tableDataUp1', JSON.parse(res.data.tableContent).tableDataUp1)
          this.$set(this.tableDataUp, 'tableDataUp2', JSON.parse(res.data.tableContent).tableDataUp2)
          this.$set(this.tableDataUp, 'tableDataUp3', JSON.parse(res.data.tableContent).tableDataUp3)
          this.$set(this.tableDataUp, 'tableDataUp4', JSON.parse(res.data.tableContent).tableDataUp4)
        }
      })
      relationList({ submitName: row.submitName }).then(res => {
        this.relationData = res.rows
        this.relationTotal = res.total
      })
      this.getProcessLog()
      this.getProcessRemark()
      getImageList({ barcodeCode: row.barcodeCode }).then(res => {
        this.applyList = []
        res.data.map(el => {
          this.applyList.push('https://lrp-interface.huayinlab.com' + el.url)
        })
      })
      if (this.tabIndex == 0) {
        this.getTable()
      }
      this.paramsArr[0] = {
        contentList: [],
        headerList: [],
        htsUnscrambleVo: row
      }
      this.paramsArr[1] = {
        contentList: [],
        headerList: [],
        htsUnscrambleVo: row
      }
      this.paramsArr[2] = {
        contentList: [],
        headerList: [],
        htsUnscrambleVo: row
      }
      this.paramsArr[3] = {
        contentList: [],
        headerList: [],
        htsUnscrambleVo: row
      }
      getReportPreview(this.paramsArr).then((res) => {
        // let url = 'http://gaotongliang.mdshuzhi.com' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        let url = 'http://hyg01.cn:6946' + res.msg.replace('/Web/WebData/Result/', '/analyze/')
        this.scanReportUrl = url
      })
    },
    handleSelectionChangeUp1(val) {
      // console.log(val);
      // if (this.tabIndex2 == 0) {
      this.paramsArr[0] = {
        contentList: val,
        headerList: this.tableDataDown.headList,
        htsUnscrambleVo: this.detail
      }
      // }
      // if (this.tabIndex2 == 1) {
      // this.paramsArr[1] = {
      //   contentList: val,
      //   headerList: this.tableDataDown.headList,
      //   htsUnscrambleVo: this.detail
      // }
      // }
      // if (this.tabIndex2 == 2) {
      // this.paramsArr[2] = {
      //   contentList: val,
      //   headerList: this.tableDataDown3.headList,
      //   htsUnscrambleVo: this.detail
      // }
      // }
      // if (this.tabIndex2 == 3) {
      // this.paramsArr[3] = {
      //   contentList: val,
      //   headerList: this.tableDataDown3.headList,
      //   htsUnscrambleVo: this.detail
      // }
      // }
    },
    handleSelectionChangeUp2(val) {
      this.paramsArr[1] = {
        contentList: val,
        headerList: this.tableDataDown.headList,
        htsUnscrambleVo: this.detail
      }
    },
    handleSelectionChangeUp3(val) {
      this.paramsArr[2] = {
        contentList: val,
        headerList: this.tableDataDown3.headList,
        htsUnscrambleVo: this.detail
      }
    },
    handleSelectionChangeUp4(val) {
      this.paramsArr[3] = {
        contentList: val,
        headerList: this.tableDataDown3.headList,
        htsUnscrambleVo: this.detail
      }
    },
    selectAll(data) {
      const exist = this.tableDataUp.tableDataUp1.map((i) => i[0]);
      if (data.length) {
        // 全选
        const index = data.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp1.push(...data.filter((item, index) => !target.includes(index)))
      } else {
        // 全不选
        const index = this.tableDataDown.contentList.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp1 = this.tableDataUp.tableDataUp1.filter((item, index) => !target.includes(index));
      }
    },
    selectAll2(data) {
      const exist = this.tableDataUp.tableDataUp2.map((i) => i[0]);
      if (data.length) {
        // 全选
        const index = data.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp2.push(...data.filter((item, index) => !target.includes(index)))
      } else {
        // 全不选
        const index = this.tableDataDown.contentList.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp2 = this.tableDataUp.tableDataUp2.filter((item, index) => !target.includes(index));
      }
    },
    selectAll3(data) {
      const exist = this.tableDataUp.tableDataUp3.map((i) => i[0]);
      if (data.length) {
        // 全选
        const index = data.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp3.push(...data.filter((item, index) => !target.includes(index)))
      } else {
        // 全不选
        const index = this.tableDataDown3.contentList.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp3 = this.tableDataUp.tableDataUp3.filter((item, index) => !target.includes(index));
      }
    },
    selectAll4(data) {
      const exist = this.tableDataUp.tableDataUp4.map((i) => i[0]);
      if (data.length) {
        // 全选
        const index = data.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp4.push(...data.filter((item, index) => !target.includes(index)))
      } else {
        // 全不选
        const index = this.tableDataDown3.contentList.map((i) => i[0]);
        const target = index.map((i) => exist.indexOf(i)).filter((i) => i !== -1);
        this.tableDataUp.tableDataUp4 = this.tableDataUp.tableDataUp4.filter((item, index) => !target.includes(index));
      }
    },
    isSelect(select, row) {
      console.log(select, '----');
      if (this.tabIndex2 == 0) {
       
        const index = this.tableDataUp.tableDataUp1.findIndex((item) => item[0] === row[0]);
        if (index !== -1) {
          this.tableDataUp.tableDataUp1.splice(index, 1)
        } else {
          this.tableDataUp.tableDataUp1.push(row)
        }
      }
      if (this.tabIndex2 == 1) {
       
        const index = this.tableDataUp.tableDataUp2.findIndex((item) => item[0] === row[0]);
        if (index !== -1) {
          this.tableDataUp.tableDataUp2.splice(index, 1)
        } else {
          this.tableDataUp.tableDataUp2.push(row)
        }
      }
      if (this.tabIndex2 == 2) {
        
        const index = this.tableDataUp.tableDataUp3.findIndex((item) => item[0] === row[0]);
        if (index !== -1) {
          this.tableDataUp.tableDataUp3.splice(index, 1)
        } else {
          this.tableDataUp.tableDataUp3.push(row)
        }
      }
      if (this.tabIndex2 == 3) {
        
        const index = this.tableDataUp.tableDataUp4.findIndex((item) => item[0] === row[0]);
        if (index !== -1) {
          this.tableDataUp.tableDataUp4.splice(index, 1)
        } else {
          this.tableDataUp.tableDataUp4.push(row)
        }
      }
      // this.$nextTick(() => {
      //   this.$refs['multipleTable1'].toggleAllSelection()
      //   this.$refs['multipleTable2'].toggleAllSelection()
      //   this.$refs['multipleTable3'].toggleAllSelection()
      //   this.$refs['multipleTable4'].toggleAllSelection()
      // })
    },



    // selectableFunc4() {
    //   return this.tabIndex2 === 1
    // },
    selectableFunc() {
      return this.tabIndex2 === 0 || this.tabIndex2 === 1
    },
    selectableFunc2() {
      return this.tabIndex2 === 2
    },
    selectableFunc3() {
      return this.tabIndex2 === 3
    },
    timeChange1() {
      if (!this.value1) {
        this.value1 = []
      }
      this.params.endRegisterTime = this.value1[0];
      this.params.startRegisterTime = this.value1[1];
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.params.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.params.pageNum = val;
      this.getList();
    },
    handleSizeChange1(val) {
      this.pageSize1 = val
    },
    handleCurrentChange1(val) {
      this.currentPage1 = val
    },
    handleSizeChange2(val) {
      this.pageSize2 = val
    },
    handleCurrentChange2(val) {
      this.currentPage2 = val
    },
    handleSizeChange3(val) {
      this.pageSize3 = val
    },
    handleCurrentChange3(val) {
      this.currentPage3 = val
    },
    handleSizeChange4(val) {
      this.pageSize4 = val
    },
    handleCurrentChange4(val) {
      this.currentPage4 = val
    },
    handleSizeChange5(val) {
      this.pageSize5 = val
    },
    handleCurrentChange5(val) {
      this.currentPage5 = val
    },
    handleSizeChange6(val) {
      this.pageSize6 = val
    },
    handleCurrentChange6(val) {
      this.currentPage6 = val
    },
    handleSizeChange7(val) {
      this.pageSize7 = val
    },
    handleCurrentChange7(val) {
      this.currentPage7 = val
    },
    handleSizeChange8(val) {
      this.pageSize8 = val
    },
    handleCurrentChange8(val) {
      this.currentPage8 = val
    },
    handleSizeChange9(val) {
      this.pageSize9 = val
    },
    handleCurrentChange9(val) {
      this.currentPage9 = val
    },
    getList() {
      this.loading = true
      microorganismReadList(this.params).then(res => {
        if(this.stateId){
          const rows=res.rows.find(e=>e?.stateId===this.stateId)
          this.row=rows
        }
        this.tableData = res.rows;
        this.listTotal = res.total;
        this.loading = false
      });
    },
    sureToAddRemark() {
      let params = {
        stateId: this.detail.stateId,
        processContent: this.processContent
      }
      insertProcessLog(params).then(() => {
        this.$message.success('添加备注成功')
        this.getProcessRemark()
      })
      this.addRemarkDialog = false;
    },
    cancelSubmitReport() {
      let data = {
        processContent: this.processContent,
        reportUrl: this.detail.reportUrl,
        stateId: this.detail.stateId
      }
      cancelSubmitReport(data).then(() => {
        this.$message.success('取消提交报告成功')
        this.row.status = 0
        this.row.operationStatus = 6
        this.row.professionalGroup = this.row.professionalGroupId
        this.row.entryDate = this.row.inputDate
        this.row.sampleType = this.row.sampleTypeId
        this.row.registrationTime = this.row.registerCreateDate
        this.row.projectType = this.row.projectTypeId
        manageOperation(this.row)
        this.cancelSubmitReasonDialog = false;
        this.getList()
      })

    },
    rowStyle({ row }) {
      var arr = this.ids;
      for (let i = 0; i < arr.length; i++) {
        if (row.id === arr[i]) {
          return "rowStyle";
        }
      }
    },

    translate() {
      let asideDiv = document.querySelector(".aside");
      asideDiv.classList.toggle("widthActive");
    },
    getDefaultDate() {
      var now = new Date();
      var date = now.getDate();
      // now.setDate(date - 1);  //获取前一天
      var y = now.getFullYear();
      var m = (now.getMonth() + 1).toString().padStart(2, "0");
      var d = now.getDate().toString().padStart(2, "0");
      var defaultDate = y + "-" + m + "-" + d + ' ' + '00:00:00';
      var defaultDate2 = y + "-" + m + "-" + d + ' ' + '23:59:59';
      this.$set(this.value1, 0, defaultDate),
        this.$set(this.value1, 1, defaultDate2)
      this.timeChange1()
    },
    // 下拉框
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    // 多个下拉框的数据
    loadAll() {
      const array = [
        this.projectTypeList,
        this.userList
      ];
      return array;
    },
    handleSelectProject(item) {
      this.params.projectType = item.id
    },
    // 聚焦下拉框时
    change(i) {
      this.restaurants = this.loadAll()[i];
      // console.log(this.restaurants);
    },
  },
  created() {
    this.getDefaultDate();
    // professional().then(res=>{
    //   console.log(res);
    // let obj={}
    // res.rows.map((el)=>{
    //   for(let k in obj){
    //     k=el.id,
    //     obj[k]=el.name
    //   }
    //   console.log(obj,'7777');
    // })

    // })

    Arr.projectTypeArr.map(el => {
      this.projectTypeList.push({
        value: el.name,
        id: el.id
      })
    })
  },
  mounted() {

    this.$nextTick(() => {
      // 根据浏览器高度设置初始高度
      this.heights =
        window.innerHeight - this.$refs.refsTable.offsetHeight - 180;
      // 监听浏览器高度变化，修改表格高度
      window.onresize = () => {
        this.heights =
          window.innerHeight - this.$refs.refsTable.offsetHeight - 180;
      };
      this.heights2 =
        window.innerHeight - 250;
      // 监听浏览器高度变化，修改表格高度
      window.onresize = () => {
        this.heights2 =
          window.innerHeight  - 250;
      };
      
    });

    this.getList();
    this.Arr = Arr;
    this.arr = arr;

  },
  updated() {
    // console.log(this.$refs["multipleTable"],3333);
    // this.$nextTick(()=>{
    // console.log(this.$refs["multipleTable"],4444);
    this.$refs["multipleTable1"].doLayout();
    this.$refs["multipleTable2"].doLayout();
    this.$refs["multipleTable3"].doLayout();
    this.$refs["multipleTable4"].doLayout();
    // })
    this.$refs.multipleTableAutocheck1.doLayout()
    this.$refs.multipleTableAutocheck2.doLayout()
    this.$refs.multipleTableAutocheck3.doLayout()
    this.$refs.multipleTableAutocheck4.doLayout()
    this.$refs.multipleTableAutocheck5.doLayout()
    this.$refs.multipleTableAutocheck6.doLayout()
    this.$refs.multipleTableAutocheck7.doLayout()
    this.$refs.multipleTableAutocheck8.doLayout()
    this.$refs.multipleTableAutocheck9.doLayout()

  },
};
</script>

<style lang="scss" scoped>
.packages {
  position: relative;
  padding: 10px;
  margin-top: 10px;
  background-color: #fff;

  .relationDiv {

    border: 1px solid rgb(220, 223, 230);
    border-radius: 4px;
    display: flex;

    .relationAside {
      width: 30%;
      border-right: 1px solid rgb(220, 223, 230);
      height: 65vh;
      padding: 5px
    }

    .relationMain {
      width: 70%;
      min-height: 65vh;
      padding: 5px
    }
  }

  .container {
    // height: 87vh;
    border: 1px solid rgb(220, 223, 230);
    border-radius: 4px;
    display: flex;
  }

  .container2 {
    // max-height: 270px;
    // background-color: #d5e4fb;
    padding: 0 5px 0 5px;
    margin: 0;

    ::v-deep .el-tabs__item {
      /* 修改为您想要的文字大小 */
      // font-size: 10px!important;
      // width:70px;
      // padding:0;
      // text-align: center;
      height: 30px;
      line-height: 30px;
      // height-line:20px
    }
  }


  .aside {
    width: 31%;
    border-right: 1px solid rgb(220, 223, 230);
    padding: 5px 5px 5px 5px;
    box-sizing: border-box;
    position: relative;

    ::v-deep .el-form-item__label {
      font-size: 12px;
      // transform:scale(0.83,0.83)

    }

    ::v-deep .el-form-item__content {
      font-size: 12px;
      // transform:scale(0.83,0.83)
    }

    .form_item {
      .el-form-item {
        margin-bottom: 0px;
      }
    }
  }

  .main {
    width: 69%;
    padding: 5px 10px 5px 10px;
    flex: 1;
    position: relative;

    .translateBtn {
      position: absolute;
      width: 15px;
      height: 15px;
      bottom: 50%;
      left: -2px;
      border-radius: 50%;
      border: 1px solid #0066ff;
      z-index: 99;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }
  }

  .container3 {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    // justify-content: space-around;
    background-color: #d5e4fb;
    width: 100%;
    height: 75vh;
    padding: 5px 15px 5px 15px;
    overflow-y: auto
  }

  .container4 {
    padding: 5px;
    background-color: #d5e4fb;
    width: 100%;
    height: 75vh;
    // border:2px solid red
  }

  .container4_1 {
    height: 500px;
    overflow-y: auto;
    background-color: #d5e4fb;
  }

  .demo-image__preview {
    position: relative;

    // .el-icon-circle-close {
    //   position: absolute;
    //   right: 5px;
    //   top: 5px;
    //   z-index: 99;
    //   font-size: 20px;
    //   color: white;
    //   cursor: pointer;
    // }
  }

  .czDiv {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-evenly;
  }

  .searchBox {
    height: 30px;
    position: relative;
    float: right;
    // margin-top: 0px;
    z-index: 99;
    // #d5e4fb
  }

  .btnBox {
    height: 30px;
    position: relative;
    float: right;
    z-index: 99;
  }

  ::v-deep .el-table__body tr.current-row>td {
    background: #a8d6fe !important;
  }

  ::v-deep .el-table__body tr:hover>td {
    background: #a8d6fe !important;
  }

  ::v-deep .rowStyle {
    background-color: #a8d6fe !important;
  }

  .el-form-item {
    margin-bottom: 10px;
  }

  .block {
    width: 100%;
    height: 50px;
    background-color: #fff;
    position: absolute;
    display: flex;
    flex-direction: row-reverse;
    bottom: 0px;
    right: 0px;
    z-index: 99;
  }

  .returnForm {
    .el-form-item {
      margin-bottom: 17px;
    }
  }

  // .el-menu-vertical-demo:not(.el-menu--collapse) {
  //   width: 200px;
  //   min-height: 400px;
  // }

  .widthActive {
    width: 10px;
    opacity: 0;
  }

  ::v-deep .el-pagination__jump {
    margin: 0;
    padding: 0;
  }

  ::v-deep .el-pagination__sizes {
    margin: 0;
    padding: 0;
  }

  ::v-deep .el-pagination__total {
    margin: 0;
    padding: 0;

  }

  .basicInfoBox {
    // height: 720px;
    padding: 5px;
    // border:2px solid blue;
    .el-form-item {
      margin-bottom: 10px;
    }

    .el-input {
      width: 170px;
    }
  }

  .relationBtn {
    position: relative;
  }

}
</style>
